<template>
	<view class="news-module">
		<view class="mod-custom-bar">
			<view class="custom-black" @click="back">
				<text class="cuIcon-back"></text><text>返回</text>
			</view>
			<view class="custom-content">
				<text>{{title}}</text>
			</view>
		</view>
		<!-- <view class="news-content">
			<rich-text :nodes="content"></rich-text>
		</view> -->
		<view class="">
			<step9 :status='status' :id='id' v-if="currentStep=='step9'"></step9>
		</view>
		<view class="options-bar">
			<view class="option-box box-default" type='default' @click="lookRemark">
				审批记录
			</view>
			<view class="option-box box-danger" v-if="isApprove=='0' && status!='Finished'&&status!='BHHTOperator'"
				type='danger' @click="lookApproveModal('0')">
				驳回
			</view>
			<view class="option-box box-blue" v-if="isApprove=='0' &&status!='Finished'&&status!='BHHTOperator'"
				type='blue' @click="lookApproveModal('1')">
				同意
			</view>
		</view>
		<remark-Modal ref='remarkModal'></remark-Modal>
		<approve-modal ref='approveModal'></approve-modal>
	</view>
</template>

<script>
	import {
		queryNewsById
	} from '../../../api/service.js'
	// import Step1 from '../../../pages/component/contract/step1.vue'
	import step9 from '../contract/step9.vue'
	import remarkModal from '../../../pages/basic/remarkModal.vue'
	import approveModal from '../../../pages/component/contract/apprvoeModal.vue'
	export default {
		data() {
        return {
            content: '',
            title: '',
            currentStep: 'step9',
            status: '',
            id: '',
            type: '',
            pId: '',
            entityType: '',
            processId: '',
            isApprove: '',
            processStatus: '',
            stype: 1,
            messageMap: {
                NlgGkHtPrjMgrApprove: '已审核合同的合法性、经济性、可行性、严密性和业务相关性。同意签署合同',
                NlgGkHtPowerApprove: '已对合同合法性、经济型、可行性、严密性、业务相关性、立项情况、招投标手续等进行全面审查，同意签署',
                NlgGkHtLawApprove: '已对合同文本合法性进行复审，同意签署',
                NlgGkHtMgrSealApproval: '经审查符合用印规范，同意用印',
                NlgGcPrjMgrApprove: '已对下列事项进行审核，同意签署合同 1.本合同的签订及履行严格遵守法律及学校有关规定 2.已严格审查合同相对方的资格、资信情况和履约能力 3.合同相对方名称（姓名）与签章一致 4.本人与合同相对方无利益关系 5.清楚合同的履行时间、地点、方式和违约条款 6.不侵犯他人的知识产权 7.其他需说明的事项已补充',
                NlgGcDeptMgrApprove: '已审核合同的合法性、经济性、可行性、严密性和业务相关性。同意签署合同',
                NlgGcDeputySealApprove: '已对合同合法性、经济型、可行性、严密性、业务相关性、立项情况、招投标手续等进行全面审查，同意签署',
            }
        };
    },
		components: {
			step9,
			approveModal,
			remarkModal
		},
		onLoad(option) {
		    // console.log(option)
		    this.title = option.title;
		    this.id = option.id;
		    this.pId = option.pId;
		    this.isApprove = option.isApprove;
		    this.processStatus = option.processStatus;
		    this.getNewsById(option.id);
		    console.log('审核' + this.processStatus);
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			getNewsById(id) {
				queryNewsById({
					id: id
				}).then(res => {
					console.log('进入方法')
					if (res.success) {
						this.entityType = res.result.entityType;
						this.processId = res.result.processId;
						this.status = res.result.processStatus;
					}
				})
			},
			lookApproveModal(type) {
				var data = {
				  approve: type,
				  id: this.id,
				  processId: this.pId,
				  applyType:'2',
				  message: ''
				};
				
				// if (type === '1') {
				// 	console.log('流程进度'+this.processStatus)
				//   const value = this.messageMap[this.processStatus]; // 从 hashMap 中获取值
				//   console.log('value'+value)
				//   data.message = value !== undefined ? value : '';
				// }
				
				this.$refs.approveModal.show(data);

			},
			lookRemark() {
				console.log('审批页面获取Id' + this.isApprove)
				this.$refs.remarkModal.show(this.id, this.processId);
			},
			changeModule(e) {
				this.currentStep = e.currentTarget.dataset.name
			},
			back() {
				uni.$emit('update', {
					msg: '页面更新'
				})
				uni.navigateBack({
					delta: 1
				})
			},
		},
		 addMultipleValues() {
		      // 创建一个包含多个键值对的对象
			  console.log('this'+this)
		      const multipleValues = {
		        NlgGkHtPrjMgrApprove: '已审核合同的合法性、经济性、可行性、严密性和业务相关性。同意签署合同',
		        NlgGkHtPowerApprove: '已对合同合法性、经济型、可行性、严密性、业务相关性、立项情况、招投标手续等进行全面审查，同意签署',
		        NlgGkHtLawApprove: '已对合同文本合法性进行复审，同意签署',
				NlgGkHtMgrSealApproval: '经审查符合用印规范，同意用印',
				NlgGcPrjMgrApprove:'已对下列事项进行审核，同意签署合同 1.本合同的签订及履行严格遵守法律及学校有关规定 2.已严格审查合同相对方的资格、资信情况和履约能力 3.合同相对方名称（姓名）与签章一致 4.本人与合同相对方无利益关系 5.清楚合同的履行时间、地点、方式和违约条款 6.不侵犯他人的知识产权 7.其他需说明的事项已补充',
				NlgGcDeptMgrApprove:'已审核合同的合法性、经济性、可行性、严密性和业务相关性。同意签署合同',
				NlgGcDeputySealApprove:'已对合同合法性、经济型、可行性、严密性、业务相关性、立项情况、招投标手续等进行全面审查，同意签署',
			  };
		
		      // 使用对象扩展运算符将多个键值对合并到哈希表中
		      this.messageMap = { ...this.messageMap, ...multipleValues };
			  console.log('hashMap'+JSON.stringify(this.messageMap))
	},
	
	}
</script>

<style lang="scss">
	.news-module {
		width: 100%;
		// height: 100%;
		background: #fff;
		// display: flex;
	}

	.mod-custom-bar {
		position: fixed;
		/* 将元素固定在页面顶部 */
		top: 0;
		/* 距离顶部0 */
		left: 0;
		/* 距离左边0 */
		right: 0;
		/* 距离右边0 */
		z-index: 1000;
		/* 确保在其他内容之上 */
		background: linear-gradient(135deg, rgba(157, 77, 247, 1.0) 0%, rgba(72, 133, 224, 1.0) 100%);
		color: #fff;
		/* 文字颜色 */
		line-height: 76rpx;
		/* 行高 */
		display: flex;
		flex-direction: row;
		justify-content: center;
	}

	.news-content {
		// display: flex;
		// justify-content: center;
		// align-items: center;
		position: relative;
		max-width: 100%;
		width: 100%;
		height: auto;
		padding: 20rpx 20rpx;
		overflow-x: hidden;
		box-sizing: border-box;

		p,
		div,
		a {
			width: 750rpx !important;
			overflow: hidden;
			text-indent: 0 !important;
		}

		// img{
		// 	max-width: 750rpx!important;

		// }
	}

	.options-bar {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 1000;
		background: #fff;
		border-top: 2px solid #f5f5f5;
		display: flex;
		/* 使用 flex 布局 */
		justify-content: space-around;
		/* 在行内均匀分布按钮 */
		align-items: center;
		/* 垂直居中对齐按钮 */
		padding: 10px;
		box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
		/* 添加阴影 */
	}

	.option-box {
		padding: 10px 0;
		/* 调整按钮的上下内边距 */
		border-radius: 5px;
		cursor: pointer;
		text-align: center;
		/* 文字居中 */
		transition: all 0.3s ease;
		/* 添加过渡效果 */
	}

	.option-box[type='default'] {
		background: #f0f0f0;
		color: #333;
		flex: 1;
		/* 使按钮均匀分布 */
		margin: 0 5px;
		/* 调整按钮之间的间距 */
	}

	.option-box[type='danger'] {
		background: #ff6347;
		/* 红色 */
		color: #fff;
		flex: 0 0 100px;
		/* 固定按钮宽度为 100px */
		margin: 0 10px;
		/* 调整按钮之间的间距 */
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
		/* 添加阴影 */
	}

	.option-box[type='blue'] {
		background: #1e90ff;
		/* 蓝色 */
		color: #fff;
		flex: 0 0 115px;
		/* 设置“同意”按钮的固定宽度为 150px */
		margin: 0 10px;
		/* 调整按钮之间的间距 */
		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
		/* 添加阴影 */
	}

	/* 悬停效果 */
	.option-box:hover {
		transform: translateY(-2px);
		/* 向上移动 */
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
		/* 增加阴影 */
	}

	.option-box[type='danger']:hover {
		background: #e5533d;
		/* 深一点的红色 */
	}

	.option-box[type='blue']:hover {
		background: #1c7ed6;
		/* 深一点的蓝色 */
	}

	.custom-black {
		flex: 0 1 auto;
		color: #fff;
	}

	.custom-content {
		flex: 1;
		color: #fff;
		text-align: center;
	}
</style>